import 'package:flutter/material.dart';
import 'package:flutter_mall/routes/application.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class Goods extends StatefulWidget {
  @override
  _GoodsState createState() => _GoodsState();
}

class _GoodsState extends State<Goods> {

  @override
  void initState() {
    // TODO: implement initState
    print("goods");
    super.initState();
  }

  int cur = 0;

  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(context,width:750,height:1334);
    return Scaffold(
      appBar: AppBar(
        title: Text("分类"),
      ),
      body: Row(
        children: <Widget>[
          _left(),
          _right(),
        ],
      ),
    );
  }

  Widget _left() {
    return Container(
      width: ScreenUtil().setWidth(200),
      child: ListView.builder(
        itemBuilder: (context,index){
          return GestureDetector(
            onTap: () {
              setState(() {
                cur = index;
              });
            },
            child: Container(
              color: cur==index ? Colors.grey[100] : Colors.white,
              height: ScreenUtil().setWidth(100),
              child: Center(
                child: Text("分类"+index.toString(),style: TextStyle(color: cur==index ? Colors.red : Colors.grey),),
              ),       
            ),
          );
        },
        itemCount: 30
      ),
    );
  }

  Widget _right() {
    return Expanded(
      child: ListView.builder(
        itemBuilder: (context,i) {
          return GestureDetector(
            child: Container(
              height: ScreenUtil().setWidth(210),
              color: Colors.grey[100],
              padding: EdgeInsets.all(ScreenUtil().setWidth(15)),
              child: DecoratedBox(
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(ScreenUtil().setWidth(20))
                ),
                child: Container(
                  padding: EdgeInsets.all(ScreenUtil().setWidth(15)),
                  color: Colors.grey[100],
                  child: _goodsInfo(i),
                ),
              )
            ),
            onTap: () {
              Application.router.navigateTo(context, "/goods/detail?id=$i");
            },
          );
        },
        itemCount: 20,
      )
    );
  }

  Widget _goodsInfo(int index) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Image.network(
          "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2259614868,961155351&fm=26&gp=0.jpg",
          width: ScreenUtil().setWidth(150),
          height: ScreenUtil().setWidth(150),
          fit: BoxFit.cover,
        ),
        Expanded(child: Container(
          padding: EdgeInsets.only(left:ScreenUtil().setWidth(20)),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text("商品名称"+index.toString(),maxLines: 1,overflow: TextOverflow.ellipsis),
              Expanded(child: Text("商品描述"*6,maxLines: 1,overflow: TextOverflow.ellipsis,style: TextStyle(fontSize: ScreenUtil().setWidth(26),color:Colors.grey[600]))),
              Expanded(child: Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  Text("￥99.00",style: TextStyle(color: Colors.red)),
                  Text("￥99.00",style: TextStyle(color: Colors.red))
                ],
              ))
            ],
          ),
        ))
      ],
    );
  }
}